<template>
  <div class="header">
    <el-row>
      <el-col :span="6">
        <router-link to="/">
          <img src="../../assets/images/index/stumalllogo.png" class="logo"/> 
        </router-link>
      </el-col>
      <el-col :span="18">
        <div class="nav-menu">
          <el-menu mode="horizontal" router>
            <el-menu-item index="/favorites">
              <i class="el-icon-star-off"></i>收藏
            </el-menu-item>
            <el-menu-item index="/orders">
              <i class="el-icon-document"></i>订单
            </el-menu-item>
            <el-menu-item index="/cart">
              <i class="el-icon-shopping-cart-2"></i>购物车
            </el-menu-item>
            <el-submenu index="4">
              <template slot="title">
                <i class="el-icon-setting"></i>管理
              </template>
              <el-menu-item index="/user/password">修改密码</el-menu-item>
              <el-menu-item index="/user/profile">个人资料</el-menu-item>
              <el-menu-item index="/user/upload">上传头像</el-menu-item>
              <el-menu-item index="/address">收货管理</el-menu-item>
            </el-submenu>
            <el-menu-item index="/login">
              <i class="el-icon-user"></i>登录
            </el-menu-item>
          </el-menu>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: 'Header'
}
</script>

<style scoped>
.header {
  padding: 20px;
  box-shadow: 0 2px 4px rgba(0,0,0,.12);
}

.logo {
  height: 40px;
}

.nav-menu {
  float: right;
}
</style> 